<template>
  <view class="installTimeLine-wrap">
    <tm-sheet
      _class="flex-col"
      :margin="[0]"
      :padding="[0, 30]"
      v-if="props.instanceTaskInfo"
    >
      <view>
        <tm-timeline >
          <tm-timeline-item 
            icon="tmicon-yuan" 
            :size="42"
            type="outlined" 
            color="#3D5ED1"
            :time="item.createTime" 
            :border="0"
            class="time-line"
            v-for="(item,index) in props.instanceTaskInfo" 
            :key="index"
          >
            <tm-sheet no-level  :round="3" :margin="[0,10]" :padding='[0]' :width="550" :shadow="5" >
              <view v-if="props.instanceTaskInfo" class="bgwhite">
                <view class="mg5">
                  审批人：{{ OrgCtrl.user.findShareById(item.createUser).name }}
                </view>
                <view class="mg5">
                  审批结果：{{ item.status < 200 ? '通过' : '拒绝' }}
                </view>
                <!-- <view class="mg10">
                  审批时间：{{item.createTime }}
                </view> -->
                <view class="mg5" v-show="item.comment">
                  审批意见：{{ item.comment }}
                </view>
              </view>
            </tm-sheet>
          </tm-timeline-item>
        </tm-timeline>
      </view>
    </tm-sheet>
    <tm-sheet v-else :margin="[0]">
      <tm-result
        :showBtn="false"
        subTitle="暂无数据"
        title="历史痕迹加载失败"
      ></tm-result>
    </tm-sheet>
  </view>
</template>
<script lang="ts" setup>
import OrgCtrl from '@/ts/controller'

type Props = {
  instanceTaskInfo: any[]
}

const props = defineProps<Props>()
// const data = await OrgCtrl.work.loadInstance()
</script>

<style lang="scss" scoped>
.installTimeLine-wrap {
}
.mg5 {
  margin: 5px;
}
.bgwhite{
  padding: 10px;
  border: 1px solid #E7E7E7;
  background-color: #fff;
}
.time-line::before{
  content: '';
  display: block;
  width: 1px;
  min-height: 125px;
  position: absolute;
  left: 35px;
  background-color: #3D5ED1;
}
</style>
